<template>
  <div>
    <pdf ref="pdf" v-for="i in numPages" :key="i" :src="`${$store.state.url_official}office/out/downLoad/${pdfUrlId}`" :page="i"></pdf>
  </div>
</template>
<script>
import pdf from "vue-pdf";
export default {
  props: {
    pdfUrlId: {
      type: Number,
      default: 0,
    },
  },
  components: {
    pdf,
  },
  data() {
    return {
      numPages: null, // pdf 总页数
    };
  },
  methods: {
    // 计算pdf页码总数
    getNumPages() {
      let loadingTask = pdf.createLoadingTask(
        `${this.$store.state.url_official}office/out/downLoad/${this.pdfUrlId}`
      );
      loadingTask.promise
        .then((pdf) => {
          this.numPages = pdf.numPages;
        })
        .catch((err) => {
          console.error("pdf 加载失败", err);
        });
    },
  },
  mounted() {
    console.log(
      `${this.$store.state.url_official}office/out/downLoad/${this.pdfUrlId}`,
      "pdf下载链接"
    );
    this.getNumPages();
  },
};
</script>